<!--
 * new page
 * @author: sunYihui
 * @since: 2024-08-30
 * StoreView.vue
-->
<template>
  <div class="body">
    <div class="title">门店列表</div>
    <Table   ref="userTable" v-bind="tableConfig">
      <template #search="{ searchSubmit, params }">
        <el-form :inline="true" class="demo-form-inline">

          <el-form-item label="门店">
            <el-input style="width:150px" v-model="params.key" placeholder="搜索关键字" clearable />
          </el-form-item>

          <el-form-item label="服务范围">
            <el-select clearable v-model="params.state" style="width:120px" placeholder="请选择状态">
              <el-option label="处理完成" value="3" />
              <el-option label="正在处理" value="2" />
              <el-option label="等待处理" value="1" />
            </el-select>
          </el-form-item>

          <el-form-item>
            <el-button class="search" type="primary" @click="searchSubmit">搜索</el-button>
          </el-form-item>
        </el-form>
      </template>
      <!-- //性别处理 -->
      <template #sex="{ scope }">
        <div > {{ scope.row.sex == 1 ? '男' : '女' }}</div>
      </template>
        <!-- 管理楼栋 -->
      <template #building="{ scope }">
        <div v-for="item in scope.row.building" :key="item.id">{{ item.building }}</div>
      </template>
      
      <template #buttons="{ deleteAllHandle }">
        <el-button @click="add" type="primary">添加</el-button>
        <el-button class="del" @click="deleteAllHandle" type="danger">批量删除</el-button>
      </template>
      <template #operate="{ scope, deleteHandle }">
        <el-button @click="edit(scope.row)" type="primary">修改</el-button>
        <el-button class="delete" @click="deleteHandle(scope.row.id)" type="danger">删除</el-button>
      </template>
    </Table>
  </div>
</template>
<script lang='ts' setup>
import Table from '../../components/table/TableView.vue'
import { tableConfig } from './StoreView'
import { ref } from 'vue'
import { useRouter } from 'vue-router';
const router = useRouter();
const edit = (data: any) => {
  console.log(data);
  router.push("/stores/" + data.id);
}
const add = () => {
  router.push("/stores/0");
}





//通过ref获取表格实例来调用写在表格里面的方法
const userTable = ref<any>();


</script>
<style scoped lang="less">
@import url(../../assets/styles/baseCss/base.css);
</style>